@extends( 'layout.home' )
@section( 'content' )
    <style>
        table.list_tab tr td a {
            margin-right: 0px;
            float: none;
        }
        .result_wrap{border: 0}
        .cwdt{width: 100%;background: #eee;}
        .cwdt ul li{width: 19.5%;background: #fff;float: left;color: #666;
            box-sizing:border-box;padding: 10px;height: 100px;
        }
        .cwdt ul li:nth-of-type(odd){background: #fff;}
        .result_content ul li {
            line-height: normal;
            border: 1px dashed #ddd;
        }
    </style>
<!--搜索结果页面 列表 开始-->
<form action="#" method="post">
    <div class="result_wrap">
        <div class="result_content">
            <div class="cwdt">
                <input type="hidden" value="" id="pid">
                <ul>
                    @foreach($data as $v)
                    <li pid="{{$v['id']}}"
                        @if($v['is_rent'])style="background: rgba(200,100,200,0.1);"
                        @elseif($v['status'])style="background: rgba(200,100,200,0.1);"
                        @endif

                            @if($v['status']==1) status="1"
                            @elseif($v['is_rent']==1) status="1"
                            @else status="0" class="no"
                            @endif
                    >
                        <p style="text-align: center">{{$v['parkingspace_no']}}
                            @if($v['is_rent']) <span style="font-size: 12px;margin-left:10px;">[月租车位]</span>
                            @else <span style="font-size: 12px;margin-left:10px;">[普通车位]</span>
                            @endif
                        </p>
                        <p>
                            @if($v['status']){{$v['plate_num']}} <span style="margin-left:10px;font-size: 12px;">(停泊中)</span>
                            @elseif($v['is_rent']){{$v['plate_num']}} <span style="margin-left:10px;font-size: 12px;">(已驶出)</span>
                            @else <div style="text-align: center">空</div>
                            @endif
                        </p>
                        <p>

                        </p>
                    </li>
                    @endforeach
                </ul>
            </div>
        </div>
    </div>
    <div style="width: 100%;padding: 20px;text-align: center;"><input type="button" value="确认" id="submit"></div>
</form>
    <script src="https://cdn.bootcss.com/layer/3.1.0/layer.js"></script>
<!--搜索结果页面 列表 结束-->
<script>
    $(".cwdt ul li").click(function(){//选车位
        if($(this).attr('status')==1){return;}
        $(this).css("background-color",'rgba(29,150,241)');
        $(this).css("color",'#fff');

        $(this).siblings(".no").css("background-color",'#fff');
        $(this).siblings(".no").css("color",'#666');
        var pid = $(this).attr('pid');
        $("#pid").val(pid);
    });

    $("#submit").click(function(){//点击提交
        var pid = $("#pid").val();
        if(!pid){
            layer.msg('请选择车位');
            return;
        }
            var index=parent.layer.getFrameIndex(window.name);
            parent.$("#parkingspace_no").val(pid);
            parent.$(".piddiv").html('车位编号：NO.'+pid);
            parent.layer.close(index);
    });
</script>
@endsection
